<template>
    <RouterView />
    <!-- 底部菜单 -->
    <van-tabbar v-model="active">
        <van-tabbar-item icon="home-o" to="/show">首页</van-tabbar-item>
        <van-tabbar-item icon="records-o" to="/page">家教单 </van-tabbar-item>
        <van-tabbar-item icon="search" to="/aiChat" dot>AI建议</van-tabbar-item>
        <van-tabbar-item icon="friends-o" badge="5" to="/message">消息</van-tabbar-item>
        <van-tabbar-item icon="setting-o" badge="20" to="/myinfo">我的</van-tabbar-item>
    </van-tabbar>
</template>

<script setup>
import { ref } from 'vue'
const active = ref(0);
</script>

<style lang="less" scoped>
/* 引入第三方或自定义的字体图标样式 */
@font-face {
    font-family: 'my-icon';
    src: url('@/assets/dialogIcon/work.png') format('truetype');
}

.my-icon {
    font-family: 'my-icon';
}

.my-icon-extra::before {
    content: '\e626';
}
</style>